{% extends "base.html" %}{% load i18n crm_tags %}
{% block title %}{% translate "Follow-ups" %}{% endblock %}
{% block content %}
<div class="page-head">
  <div>
    <h1>{% translate "Follow-ups" %}</h1>
    <p>{% translate "Calls back, visits and reminders the team has promised." %}</p>
  </div>
</div>

<div class="filters">
  <div class="seg" aria-label="{% translate 'Whose' %}">
    <a href="{% url_with scope='mine' %}"{% if scope == 'mine' %} aria-current="true"{% endif %}>{% translate "Mine" %}</a>
    <a href="{% url_with scope='all' %}"{% if scope == 'all' %} aria-current="true"{% endif %}>{% translate "Whole team" %}</a>
  </div>
  <div class="seg" aria-label="{% translate 'Which' %}">
    <a href="{% url_with show='todo' %}"{% if show == 'todo' %} aria-current="true"{% endif %}>{% translate "To do" %}</a>
    <a href="{% url_with show='done' %}"{% if show == 'done' %} aria-current="true"{% endif %}>{% translate "Finished" %}</a>
  </div>
</div>

{% for label, items in groups %}
  {% if items %}
  <section class="panel" aria-label="{{ label }}">
    <div class="panel-head"><h2>{{ label }}</h2><span class="muted small">{{ items|length }}</span></div>
    <ul class="rows">
      {% for fu in items %}
      <li style="align-items:flex-start">
        <div class="grow">
          <a class="title" href="{{ fu.contact.get_absolute_url }}">{{ fu.contact.name }}</a>
          <span class="phone small muted">{{ fu.contact.phone_display }}</span>
          <div>{{ fu.label }}</div>
          <div class="meta">
            {% if scope == 'all' %}{% if fu.assigned_to %}{{ fu.assigned_to.display_name }}{% else %}{% translate "Unassigned" %}{% endif %}, {% endif %}
            {% if fu.status == 'pending' %}{{ fu.due_date|due }}{% else %}{{ fu.get_status_display }} {{ fu.completed_at|when }}{% if fu.outcome_note %}: {{ fu.outcome_note|truncatechars:140 }}{% endif %}{% endif %}
          </div>
        </div>
        {% if fu.status == 'pending' %}
        <div class="actions">
          <a class="btn btn-small btn-primary" href="{% url 'follow_up_call' fu.pk %}">{% translate "Call now" %}</a>
          <form method="post" action="{% url 'follow_up_done' fu.pk %}">
            {% csrf_token %}<input type="hidden" name="next" value="{{ request.get_full_path }}">
            <button class="btn btn-small" type="submit" name="action" value="done">{% translate "Done" %}</button>
          </form>
          <a class="btn btn-small btn-quiet" href="{% url 'follow_up_edit' fu.pk %}">{% translate "Change" %}</a>
        </div>
        {% endif %}
      </li>
      {% endfor %}
    </ul>
  </section>
  {% endif %}
{% endfor %}

{% if not groups.0.1 and not groups.1.1 and not groups.2.1 %}
<div class="panel empty"><strong>{% if show == 'done' %}{% translate "Nothing finished yet." %}{% else %}{% translate "You’re all caught up." %}{% endif %}</strong>{% translate "Plan follow-ups while logging a call, or from a contact’s page." %}</div>
{% endif %}
{% endblock %}